<template>
  <view class="container">
    <view class="login">
      <image src="/static/login1.jpg" mode="widthFix" style="width: 150rpx; margin-bottom: 40rpx;"></image>
    </view>
    
    <u-form :model="loginForm" ref="loginForm" :rules="rules">
      <!-- ... 表单项内容不变 ... -->
      <u-form-item label="手机号" prop="mobilePhone" borderBottom>
        <u-input v-model="loginForm.mobilePhone" placeholder="请输入手机号" type="number" maxlength="11"></u-input>
      </u-form-item>
      
      <u-form-item label="密码" prop="password" borderBottom>
        <u-input v-model="loginForm.password" placeholder="请输入密码" type="password" :password-icon="showPwd" @click-icon="showPwd = !showPwd"></u-input>
      </u-form-item>
      
      <view class="btn-group">
        <u-button 
          type="primary" 
          @click="handleLogin"
          :loading="loading"
          style="width: 100%"
          :custom-style="{
            backgroundColor: '#0aa573', 
            borderColor: '#0aa573',
            '&:hover': { backgroundColor: '#099466' },
            '&:active': { backgroundColor: '#088359' }
          }"
        >
          登录
        </u-button>
        
        <u-button type="text" @click="navToRegister" style="margin-top: 20rpx">
          还没有账号？去注册
        </u-button>
      </view>
    </u-form>
  </view>
</template>

<script>
export default {
  data() {
    // ... data 内容不变 ...
    return {
      loading: false,
      showPwd: false,
      loginForm: {
        mobilePhone: '',
        password: ''
      },
      rules: {
        mobilePhone: [
          { required: true, message: '请输入手机号', trigger: 'blur' },
          { pattern: /^1[3-9]\d{9}$/, message: '请输入正确的手机号', trigger: 'blur' }
        ],
        password: [
          { required: true, message: '请输入密码', trigger: 'blur' },
          { min: 6, max: 20, message: '密码长度在6-20之间', trigger: 'blur' }
        ]
      }
    }
  },
  methods: {
    navToRegister() {
      uni.navigateTo({
        url: '/pages/njt/register'
      });
    },
    handleLogin() {
      this.$refs.loginForm.validate().then(valid => {
        if (valid) {
          this.loading = true
          uni.request({
            url: 'http://localhost:8080/nongjt/userRegister/login',
            method: 'post',
            data: this.loginForm,
            success: (res) => {
              if (res.data.code === 200) {
                uni.setStorageSync('userInfo', res.data.data)
                uni.showToast({
                  title: '登录成功',
                  icon: 'success'
                })
                setTimeout(() => {
                  uni.switchTab({
                    url: '/pages/njt/home'
                  });
                }, 1500)
              } else {
                uni.showToast({
                  title: res.data.msg || '登录失败',
                  icon: 'none'
                })
              }
            },
            fail: (error) => {
              console.error('登录请求失败', error)
              uni.showToast({
                title: '网络错误',
                icon: 'none'
              })
            },
            complete: () => {
              this.loading = false
            }
          })
        }
      })
    }
  }
}
</script>

<style scoped>
/* ... 样式不变 ... */
.container {
  padding: 60rpx 40rpx;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  background-color: #f5f5f5;
}
.login {
  display: flex;
  justify-content: center;
  margin: 60rpx 0;
  padding-top: 20%;
}
.btn-group {
  margin-top: 80rpx;
  padding: 0 20rpx;
}
</style>